<template>
	<view class="container" :style="{minHeight:$height()}">
		<view class="login-header">
			<image src="@/static/image/logo.png" mode="widthFix"></image>
			<text>人人售电</text>
		</view>

		<view class="tips">
			<text class="title">该程序将获取以下授权：</text>
			<text class="tip">获取您的公开信息（获取您的手机号）</text>
			<text class="tip">若拒绝则无法使用该程序的相关功能</text>
		</view>
		<view style="height:110rpx;"></view>
		<u-input v-if="form.pid == 0" v-model="form.promoteCode" type="text" placeholder="请输入推荐码(选填)" :border="true" />
		<view class="king-align__center" style="margin:20rpx 0rpx;">
			<u-input v-model="city" style="width:80%;" type="text" placeholder="请选择省份" disabled :border="true"/>
			<button class="confirmChoose" type='primary' style="width:20%;" @click="choose" >选择</button>
		</view>
		
		<view class="buttons">
			<button class="reject" @click="reject">拒绝</button>
			<button class="confirm" type='primary' lang="zh_CN" open-type="getPhoneNumber"
				@getphonenumber="decryptPhoneNumber">允许授权手机号</button>
		</view>
		<u-picker mode="selector" :range="cityList" range-key="name" v-model="show"  @confirm="areaConfirm"  :defaultSelector="defaultSelector"></u-picker>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				cityList:[],
				city:"",
				encryptedData: '',
				show:false,
				idx:0,
				ivStr: '',
				code: '',
				defaultSelector:[0],
				form: {
					pid:uni.getStorageSync("pid")
				}
			}
		},
		onLoad() {
			this.getTreeCity()
		},
		onShow() {
			
		},
		methods: {
			reject() {
				uni.reLaunch({
					url: `/pages/index/index`
				})
			},
			getTreeCity() {
				this.$axios.request(this.$api.getCityTenantCodeAp, "GET").then((val) => {
					this.cityList = val.data
				})
			
			},
			getCode() {

				this.$wechat.getcode().then((val) => {
					this.code = val.code
				})

			},
			decryptPhoneNumber(e) {
				if (!e.target.iv) {
					uni.showModal({
						content: '获取手机号失败！',
						showCancel: false
					})
					return;
				}

				this.encryptedData = e.detail.encryptedData;
				this.ivStr = e.detail.iv

				uni.checkSession({
					success: (res) => {
						this.qiTa()
					},
					fail: (res) => {
						this.qiTa()
					}

				})
			},
			choose(){
				this.show = true
			},
			areaConfirm(e){
				this.city = this.cityList[e[0]].name
				this.form.provinceId = this.cityList[e[0]].id
				this.form.tenantCode = this.cityList[e[0]].tenantCode
			},
			qiTa() {
				uni.showLoading({
					title: '加载中',
					mask: true
				})
				
				this.$wechat.getOpenid().then((val) => {
					if(val.type == 'toutiao'){
						this.form.douyinOpenId = val.openId
					}else{
						this.form.openId = val.openId
					}
					
					
					this.$wechat.getcode().then((code) => {
						this.$axios.request(this.$api.getUserMobile, "GET", {
							code: code.code,
							type:code.type,
							encryptedData: this.encryptedData,
							ivStr: this.ivStr,
						}).then((val) => {
							if (val.code == 0) {
								this.form.mobile = val.data.mobile
								this.$axios.request(this.$api.login, "POST", this.form)
									.then((loginData) => {
										uni.setStorageSync("token", loginData.data.token)
						
										uni.setStorageSync("userinfo", loginData.data.user)
										this.$store.commit("setUserinfo", loginData.data.user)
						
										uni.setStorageSync("tenantCode", loginData.data.user.tenantCode ? loginData.data.user.tenantCode : 0)
										this.$store.commit("setTenantCode",loginData.data.user.tenantCode ?loginData.data.user.tenantCode : 0)
						
										this.$msg.toastCallback("操作成功", (e) => {
											uni.switchTab({
												url: `/pages/mine/index`
											})
										})
						
									})
						
							} else {
								this.$msg.toast("获取手机号码失败")
							}
						
						})
					})
					
				})
			}
		}
	}
</script>

<style scoped lang="scss">
	.mt {
		margin-top: 110rpx;
	}

	.container {
		padding: 30rpx;
		display: flex;
		box-sizing: border-box;
		background-color: #ffffff;
		flex-direction: column;
	}


	.login-header {
		height: 360rpx;
		width: 100%;
		border-bottom: 1px solid #f4f4f4;

		display: flex;
		align-items: center;
		justify-content: center;
		flex-direction: column;

		image {
			width: 150rpx;
			border-radius: 50%;
		}

		text {
			margin-top: 35rpx;
			font-size: 28rpx;
			color: #020202;
			font-family: PingFang SC;
		}
	}

	.tips {
		display: flex;
		flex-direction: column;
		padding: 20rpx 0rpx;
		.title {
			font-size: 30rpx;
			color: #000000;
			line-height: 100rpx;
			font-family: PingFang SC;
		}

		.tip {
			font-size: 30rpx;
			line-height: 76rpx;
			color: #7b7b7b;
			font-family: PingFang SC;
		}
	}

	.buttons {
		display: flex;


		.reject {
			color: #FFFFFF;
			height: 80rpx;
			width: 50%;
			font-size: 28rpx;
			font-weight: bold;
			line-height: 80rpx;
			text-align: center;
			margin-right: 19rpx;
			border-radius: 10rpx;
			font-family: PingFang SC;
			background: #dddddd;
		}

		.confirm {
			color: #FFFFFF;
			height: 80rpx;
			width: 50%;
			font-size: 28rpx;
			font-weight: bold;
			line-height: 80rpx;
			text-align: center;
		
			border-radius: 10rpx;
			font-family: PingFang SC;
			background: linear-gradient(100deg, #487af5 0%, #67b2f3 100%);
		}

	}
	.confirmChoose {
		color: #FFFFFF;
		height: 70rpx;
		width: 50%;
		font-size: 28rpx;
		font-weight: bold;
		line-height: 70rpx;
		text-align: center;
	
		border-radius: 10rpx;
		font-family: PingFang SC;
		background: linear-gradient(100deg, #487af5 0%, #67b2f3 100%);
	}
	
</style>